<template>
	<div class="page-row p-x-0">
		<div class="box-left">
			<el-menu default-active="0" @select="change" class="el-menu-vertical-demo">
				<el-menu-item v-for="(item,index) in caselist" :key="index" :index="index.toString()">
					<span slot="title">{{item.casename}}</span>
				</el-menu-item>
			</el-menu>
		</div>
		<div class="box-right p-0">
			<div class="page-wrap">
				<div class="page-content p-0">
					<div class="page-column p-0" :style="{'overflow':'scroll'}">
						<el-row>
							<el-col :span="24">
								<el-table border :data="ShowList.disTab" style="width: 100%">
									<el-table-column align="center" prop="paramname" label="距离" min-width="100"></el-table-column>
								
									<el-table-column align="center" prop="MEAN" label="MEAN" min-width="100">
														<template slot-scope="scope">
															<div v-if="scope.row.MEAN=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.MEAN}}</div>
														</template>
													</el-table-column>
													<el-table-column align="center" prop="WUSHITH" label="50TH" min-width="100">
														<template slot-scope="scope">
															<div v-if="scope.row.WUSHITH=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.WUSHITH}}</div>
														</template>
													</el-table-column>
													<el-table-column align="center" prop="JIUSHITH" label="90TH" min-width="100">
															<template slot-scope="scope">
															<div v-if="scope.row.JIUSHITH=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.JIUSHITH}}</div>
														</template>
													</el-table-column>
													<el-table-column align="center" prop="JIUWUTH" label="95TH" min-width="100">
															<template slot-scope="scope">
															<div v-if="scope.row.JIUWUTH=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.JIUWUTH}}</div>
														</template>
													</el-table-column>
													<el-table-column align="center" prop="JIUJIUTH" label="99TH" min-width="100">
														<template slot-scope="scope">
															<div v-if="scope.row.JIUJIUTH=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.JIUJIUTH}}</div>
														</template>
													</el-table-column>
													<el-table-column align="center" prop="JIUJIUWUTH" label="99.5TH" min-width="100">
														<template slot-scope="scope">
															<div v-if="scope.row.JIUJIUWUTH=='1.7976931348623157e+308'">超出上限</div>
															<div v-else>{{scope.row.JIUJIUWUTH}}</div>
														</template>
													</el-table-column>
								</el-table>
								<div class="separate m-b-20"></div>
							</el-col>
						</el-row>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
import selectPara from "@/components/selectPara"
import commCheckbox from "@/components/commCheckbox"
import ImageCropper from "@/components/ImageCropper"
import FixBottomButton from "@/components/FixBottomButton"
import ueditor from "@/components/ueditor"
import textLength from "@/components/common/comp/textLength"
import { commPara } from "@/mixins/mixins"
import { mapState } from "vuex"

export default {
	name: "aboutUs",
	props: {
		basicDataF: Object,
	},
	mixins: [commPara],
	components: {
		selectPara,
		ImageCropper,
		textLength,
		commCheckbox,
		FixBottomButton,
		ueditor,
	},

	data() {
		return {
			activeTab: "2",
			YANTUANNumoptions: [],
			PARAMSoptions: [],
			distinceList: [],
			caselist: [],
			ShowList: [], 
			tableData: [],
			tableDataShow: false, 
			loading: false,
		}
	},
	computed: {
		...mapState({
			basic_Data: (state) => state.token.basic_Data,
			early_Data: (state) => state.token.early_Data,
			longterm_Data: (state) => state.token.longterm_Data,
		}),
	},
	created() {
		this.setOption(0)
	},
	methods: {
		change(index) { 
			this.setOption(index)
		},
		setOption(e) {
			let params = {
				batch_id: this.$route.query.id,
			}
			console.log(params)
			this.$appApi
				.GET_RESULT_13(params)
				.then((res) => {
					var tempres = res.data.substring(0, 1)
					if (tempres == "S") {
						var str = JSON.parse(res.data.substring(8)).type13_list 
						this.caselist = str 
						this.caselist.forEach((item, index) => { 
							if (index == e) {
								this.ShowList = item
							}
						}) 
						this.ShowList.disTab = this.ShowList.param_dis_list.map(
							(dis_paramitem) => {
								return {
									paramname: dis_paramitem.distance,
									MEAN: dis_paramitem.fin_result_list[0],
									WUSHITH: dis_paramitem.fin_result_list[1],
									JIUSHITH: dis_paramitem.fin_result_list[2],
									JIUWUTH: dis_paramitem.fin_result_list[3],
									JIUJIUTH: dis_paramitem.fin_result_list[4],
									JIUJIUWUTH:
										dis_paramitem.fin_result_list[5],
								}
							}
						) 
					} else if (tempres == "E") {
						let message = res.data.substring(6)
						this.$notify.error({
							title: "请求数据失败！",
							message: message,
							type: "success",
						})
					}
				})
				.catch((err) => {
					console.log(err)
				})
		},
	},
}
</script>
<style lang="scss" scoped>
.page-flex-row /deep/ .el-collapse-item__header {
	background: #f3f9fe;
}
</style>